<!DOCTYPE html>

<script src="">
// 需要用到的一些工具 node.js, npm, webpack, vue-cli, 
// node 它是作为一个运行环境存在, 我们在做vue项目时其实不用去了解node的语法和底层
// 查看node环境是否安装用node -v
// 安装node

// npm 它是一个保管理工具, 用来下载一些常用的组件, 可以理解成一个公共的代码仓
// 查看npm环境: npm -v
// 安装新的依赖: npm install 包名称 缩写是npm i, 如需要安装vue依赖,运行npm i vue, 安装jq: npm install jquery
// 删除一个依赖: npm uninstall, 缩写npm un, 如npm un jquery
// npm不用安装,安装了node自带npm


// webpack 是一个打包工具, 用来将开发环境的源文件打包成浏览器可以运行的html文件
// 查看webpack环境: npm -v
// 打包代码的意义是为了让开发者使用浏览器还不支持的高级语法,如ES6,ES7,less,sass等转换成浏览器能识别的ES5,css
// 安装webpack : npm i webpack webpack-cli -g

// vue-cli 它是一个vue的运行环境
// 查看vue环境 vue -V (v要大写)
// 安装: npm i vue vue-cli -g

// npm i webpack webpack-cli vue vue-cli -g

// vue基于node,webpack,npm,vue-cli环境初始化一个vue项目 : vue init webpack 项目名称
// 输入初始化项目命令后命令行会要求填写一些项目信息, 若没有特殊要求一路回车即可
// 需要填写的信息如 
// project name: 项目名称
// project description: 项目描述
// author: 作者
// install vue-router: 询问是否安装vue的路由组件, 通常选是
// Use ESLint to lint your code?: 是否使用代码格式校验, ESLint是一个代码格式校验工具
// Set up unit tests: 是否安装单元测试工具,通常选yes
// setup e2e tests 
// 项目的初始化过程实际上是命令行通过npm从网上下载项目所需的各种依赖,并完成项目的构建,所以安装需要联网
// 项目完成安装之后主要的目录结构
// build 存放的是运行和打包vue项目的相关配置 
// config 存放的是运行和打包vue项目的相关配置, 但是这里的配置主要影响项目运行时项目内的脚本环境变量
// node_modules 存放的是项目的依赖, 依赖指的是项目中需要用到的js框架的源码,如jquery也是一种依赖
// dist 存放的是项目打包之后的代码
// src 存放的是项目的源码内容,我们需要进行开发的代码全部放在这个文件夹里面
//  [-- assets 存放的是项目中需要打包的静态资源
//	[-- components 默认用来放置组件文件
//  [-- router 用来存放*路由?配置文件
//  [-- App.vue 项目的视图主文件,根节点
//  [-- main.js 项目的入口文件
// static 存放的是静态资源
// test 测试所学要的一些文件
// .eslintrc.js 设置代码校验规则, 初始化项目时如果选择了安装ESLint代码校验工具才会出现此配置
// .eslintignore 设置不进行语法校验的内容, 如果希望所有的文件暂时不进行语法校验,在此文件中添加*
// .gitignore 设置不提交到git的代码
// index.html 作为打包之后的入口文件模板?
// package.json 记录的是该项目所需要用到的依赖列表
// package-lock.json
// README.md


// 项目的运行和打包
// 运行命令: npm run dev
// 打包命令: npm run build 打包成功之后会在dist文件夹下面生成打包好的静态资源文件,要注意的是,这个静态文件index.html不能直接在本地浏览器直接打开,必须在服务器环境下运行, 学习阶段推荐在本地安装phpstudy环境,运行apache,并配置网站,将静态资源放到对应的站点根目录,即可通过站点的域名来访问

// vue项目常用的工具: 
// npm i axios

// vue项目中引入一个依赖
// import 表示导入,import后面写的是导入后的组件名称 from 后面是组件的路径 如import axios from 'Axios'
// 如需要使用axios,引入的方式是在script的头部写上import axios from 'Axios'
// 组件路径如果没有写具体的路径,默认会从node_modules下寻找,如果写了具体路径则从对应的路径上导入
// 如果下载了一个新的vue项目,必须先运行npm i (npm install)



</script>
